{include file='public/header'/}
<div class="container">
    <div class="row">
        <!-- 左侧布局 -->
        <div class="col-md-8">
            <!-- 首页幻灯片 -->
            {block name='slide'}
            {if $action=='index' && $option.slide1}
            <div class="row" style="margin-bottom: 15px;">
                <div class="col-md-12">
                    <div id="carousel-example-generic" class="carousel slide" data-ride="carousel">
                        <!-- Indicators -->
                        <ol class="carousel-indicators">
                            {if $option.slide1}<li data-target="#carousel-example-generic" data-slide-to="0"
                                class="active"></li>{/if}
                            {if $option.slide2}<li data-target="#carousel-example-generic" data-slide-to="1"></li>{/if}
                            {if $option.slide3}<li data-target="#carousel-example-generic" data-slide-to="2"></li>{/if}
                            {if $option.slide4}<li data-target="#carousel-example-generic" data-slide-to="3"></li>{/if}
                            {if $option.slide5}<li data-target="#carousel-example-generic" data-slide-to="4"></li>{/if}
                        </ol>

                        <!-- Wrapper for slides -->
                        <div class="carousel-inner" role="listbox">
                            {if $option.slide1}
                            <div class="item active">
                                <a href="{$option.slide_url1}" title="view1"><img style="width: 100%;"
                                        src="{$option.slide1}" alt="slide1"></a>
                            </div>
                            {/if}
                            {if $option.slide2}
                            <div class="item">
                                <a href="{$option.slide_url2}" title="view2"><img style="width: 100%;"
                                        src="{$option.slide2}" alt="slide2"></a>
                            </div>
                            {/if}
                            {if $option.slide3}
                            <div class="item">
                                <a href="{$option.slide_url3}" title="view3"><img style="width: 100%;"
                                        src="{$option.slide3}" alt="slide3"></a>
                            </div>
                            {/if}
                            {if $option.slide4}
                            <div class="item">
                                <a href="{$option.slide_url4}" title="view4"><img style="width: 100%;"
                                        src="{$option.slide4}" alt="slide4"></a>
                            </div>
                            {/if}
                            {if $option.slide5}
                            <div class="item">
                                <a href="{$option.slide_url5}" title="view5"><img style="width: 100%;"
                                        src="{$option.slide5}" alt="slide5"></a>
                            </div>
                            {/if}
                        </div>

                        <!-- Controls -->
                        <a class="left carousel-control" href="#carousel-example-generic" role="button"
                            data-slide="prev">
                            <span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
                            <span class="sr-only">Previous</span>
                        </a>
                        <a class="right carousel-control" href="#carousel-example-generic" role="button"
                            data-slide="next">
                            <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
                            <span class="sr-only">Next</span>
                        </a>
                    </div>

                </div>
            </div>
            {/if}
            {/block}

            <!-- 左侧文章列表 -->
            <div class="panel panel-default">
                <!-- 归档标题 -->
                {block name='archive'}
                <div class="panel-heading">{$archive_title}</div>
                {/block}
                <div class="panel-body">
                    <!-- 主体 -->
                    {block name='list'}
                    {if in_array($cate_id, $grids)}
                    <!-- 图片分类 -->
                    {volist name='posts' id='vo' empty='暂无文章'}
                    <div class="col-sm-6 col-md-4">
                        <div class="thumbnail">
                            <a href="{$vo.link}" title="{$vo.title}"><img style="width:100%;height:95px;background-color:#f1f1f1;"
                                    src="{$vo.img ?: ''}" alt="{$vo.title}"></a>
                            <div class="caption">
                                <h3 style="margin:0"><a href="{$vo.link}"
                                        title="{$vo.title}">{$vo.title}</a></h3>
                            </div>
                        </div>
                    </div>
                    {/volist}
                    {else /}
                    <!-- 图文混排 -->
                    {volist name='posts' id='vo' empty='暂无文章'}
                    <div class="row">
                        <div class="col-md-12">
                            <div class="panel panel-default">
                                <div class="panel-body">
                                    <div class="row">
                                        <div class="col-sm-3 col-md-3">
                                            <a href="{$vo.link}" class="thumbnail" title="{$vo.title}">
                                                <img style="width:100%;height:95px;background-color:#f1f1f1;"
                                                    src="{$vo.img ?: ''}"
                                                    alt="{$vo.title}" />
                                            </a>
                                        </div>
                                        <div class="col-sm-9 col-md-9">
                                            <h3 style="margin-top: 0;">
                                                <a href="{$vo.link}" title="{$vo.title}">{$vo.title}</a>
                                                {if $vo.hot}<span class="label label-danger">Hot</span>{/if}
                                            </h3>
                                            <p>{$vo.content|html_entity_decode|strip_tags|mb_strimwidth=0,110,'...','utf-8'}</p>
                                            <p><a href="{$vo.link}" rel="nofollow" class="btn btn-primary pull-right"
                                                    role="button" title="Read more">
                                                    <span class="glyphicon glyphicon-link" aria-hidden="true"></span>
                                                    Read more ...
                                                </a>
                                                <span class="glyphicon glyphicon-time" aria-hidden="true"></span>
                                                {$vo.date} &nbsp;
                                                <span class="glyphicon glyphicon-eye-open" aria-hidden="true"></span>
                                                {$vo.views}
                                            </p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    {/volist}
                    {/if}
                    {/block}

                    <!-- 分页 -->
                    {block name='pages'}
                    <div class="row">
                        <div class="col-md-12 text-center">
                            <nav aria-label="Page navigation">
                                {$posts|raw}
                            </nav>
                        </div>
                    </div>
                    {/block}
                </div>
            </div>
            <!-- 左侧底部 -->
            {block name='left'}
            {/block}
        </div>

        <!-- 右侧侧栏 -->
        <div class="col-md-4">
            {block name='side'}
            <!-- 分类目录 -->
            <div class="panel panel-default">
                <div class="panel-heading">
                    <h3 class="panel-title">分类目录</h3>
                </div>
                <div class="panel-body">
                    <!-- Panel content -->
                    <div class="row">
                    {volist name='cates' id='vo'}
                        <div class="col-xs-6 text-center" style="margin-bottom: 15px;">
                            <div class="btn-group btn-block">
                                <a class="btn btn-block {if $vo.id==$cate_id}btn-primary{else /}btn-default{/if}"
                                    href="{$vo.link}" title="{$vo.name}">{$vo.name}</a>
                            </div>
                        </div>
                    {/volist}
                    </div>
                </div>
            </div>

            <!-- 热门文章 -->
            <div class="panel panel-default">
                <div class="panel-heading">
                    <h3 class="panel-title">热门文章</h3>
                </div>
                <div class="panel-body">
                    <!-- Panel content -->
                    <div class="list-group">
                        {volist name='hots' id='vo'}
                        <a href="{$siteUrl}/detail/{$vo.id}.html" title="{$vo.title}"
                            class="list-group-item {if $vo.id==$post_id} active{/if}">
                            <span class="glyphicon glyphicon-fire" aria-hidden="true"></span> {$vo.title}
                            <span class="badge">Hot</span>
                        </a>
                        {/volist}
                    </div>
                </div>
            </div>

            <!-- 点击排行 -->
            <div class="panel panel-default">
                <div class="panel-heading">
                    <h3 class="panel-title">点击排行</h3>
                </div>
                <div class="panel-body">
                    <!-- Panel content -->
                    <div class="list-group">
                        {volist name='hits' id='vo'}
                        <a href="{$siteUrl}/detail/{$vo.id}.html" title="{$vo.title}"
                            class="list-group-item {if $vo.id==$post_id} active{/if}">
                            <span class="glyphicon glyphicon-eye-open" aria-hidden="true"></span> {$vo.title}
                            <span class="badge">{$vo.views}</span>
                        </a>
                        {/volist}
                    </div>
                </div>
            </div>

            <!-- 最近更新 -->
            <div class="panel panel-default">
                <div class="panel-heading">
                    <h3 class="panel-title">最近更新</h3>
                </div>
                <div class="panel-body">
                    <!-- Panel content -->
                    <div class="list-group">
                        {volist name='news' id='vo'}
                        <a href="{$siteUrl}/detail/{$vo.id}.html" title="{$vo.title}"
                            class="list-group-item {if $vo.id==$post_id} active{/if}">
                            <span class="glyphicon glyphicon-time" aria-hidden="true"></span> {$vo.title}
                            <span class="badge">{$vo.date|date='m-d'}</span>
                        </a>
                        {/volist}
                    </div>
                </div>
            </div>
            {/block}
        </div>
    </div>
</div>
{include file='public/footer'/}